import React from 'react';
import { Toast } from 'antd-mobile'
import { connect } from 'react-redux';
import moment from 'moment'

import { getCheckNotify } from '../common/service'
import { saveData } from '../action/UserAction'
import NoPowerShow from '../component/NoPowerShow'

class CheckNotify extends React.Component {
	constructor(props){
		super(props)
		this.state = {
			startTime: this.props.userReducer.step.preparation ? this.props.userReducer.step.preparation.approachDate : '',
		};
	}

	commit() {
		const { showLoadModal, hideLoadModal } = this.props;
		showLoadModal();
		getCheckNotify(this.props.userReducer.flowId)
		.then((data) => {
			hideLoadModal();
			const isOK = data.data;
			if (isOK.success) {
				this.props.dispatch(saveData(isOK.obj));
				this.props.currentPage(isOK.obj.flowBaseInfo.flowProcesses);
			} else {
				Toast.info(isOK.msg, 2);
			}
		})
		.catch((e) => {
			hideLoadModal();
			console.log(e);
			Toast.info('服务器异常', 2);
		})
	}
	
	render() {
		//判断是不是当前节点
		if (this.props.currentObj.flowId !== 5 || -1 === this.props.userReducer.roles.findIndex((value) => value === 60) || !this.props.isTodayStep()) {
			return (<NoPowerShow id={this.props.currentObj.flowId}></NoPowerShow>);
		}
		return (
			<div style={{padding: '3.1rem 0.2rem 0.2rem 0.2rem'}}>
				<p className='notifyText' style={{marginBottom: '0.16rem'}}>将于{moment(this.state.startTime).format('YYYY-MM-DD HH:mm')}开始施工，</p>
				<p className='notifyText'>请开始准备进场</p>
				<div 
					id='comfireNofity'
					className='btnCommit'
					style={{marginTop: '0.8rem'}}
					onTouchStart={()=>{document.getElementById('comfireNofity').style.backgroundColor = '#D97442'}}
					onTouchEnd={()=>{document.getElementById('comfireNofity').style.backgroundColor = '#FFA24A'}}
					onClick={()=>{
						this.commit()
					}}
					>
					 确认收到通知
				</div>
			</div>
		);
	}
}


function mapStateToProps(state) {
  const { userReducer } = state;
  return {
    userReducer
  };
}

export default connect(mapStateToProps)(CheckNotify);